<html>
	<head>
		<style>
			*{margin:0 auto;padding:0}
			ul{list-style:none;width:480px;height:620px}
			ul li{width:100px;height:140px;margin-right:20px;margin-top:10px;float:left}
		</style>
	</head>
	<body>
		<ul>
			<li><a href="#" onclick="pan(0)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(1)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(2)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(3)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(4)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(5)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(6)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(7)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(8)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(9)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(10)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(11)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(12)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(13)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(14)"><img src="back.png"/></a></li>
			<li><a href="#" onclick="pan(15)"><img src="back.png"/></a></li>
		</ul>
	</body>
	<script>
		var imgs=document.getElementsByTagName('img');
		
		var tus=['tu1.png','tu2.png','tu3.png','tu4.png','tu5.png','tu6.png','tu7.png','tu8.png','tu9.png','tu10.png','tu11.png','tu12.png','tu13.png','tu14.png','tu15.png','tu16.png'];
		var nums=[1,1,2,2,3,3,4,4,5,5,6,6,7,7,8,8];
		
		
	</script>
</html>